<template>
  <div class="alarmConfiguration zy-content">
    <search :columns="searchData" @getSearch="getSearch(arguments)"></search>
    <div class="alarmConfiguration">
      <div class="list-layout mt16">
        <div class="btns clear">
          <span class="title">{{ $t("common.listInformation") }}</span>
        </div>
        <div class="tableContent">
          <Table
            class="resizable-table"
            border
            @on-column-width-resize="onColumnWidthResize"
            :columns="columnsList"
            ellipsis
            ref="selection"
            stripe
            :data="dataArr"
            @on-selection-change="onSelectChange"
          >
            <template slot-scope="{ row }" slot="action">
              <span class="operationBtn" @click="linkUser(row)">查看</span>
            </template>
          </Table>
        </div>
        <div class="pageWrap mt16">
          <pageLeftTitle :total="total" />
          <Page
            :total="total"
            :page-size="pageSize"
            :page-size-opts="pageSizeOption"
            :current="pageNum"
            @on-change="changePageNum"
            @on-page-size-change="changePageSize"
            show-sizer
            show-total
          />
        </div>
      </div>
    </div>
  </div>
</template>
<script>
import search from "@/components/curd/searchList.vue";
import toggleTableOperation from "@/mixins/toggleTableOperation";
export default {
  name: "operationRecords",
  components: { search },
  mixins: [toggleTableOperation],
  data() {
    return {
      searchData: [
        {
          title: "车间",
          key: "workShop",
          type: "cascader",
          dicUrl: "/basic/organization/findListByToken?level=0",
          params: {
            label: "name",
            value: "code",
            children: "children"
          }
        },
        {
          title: "订单号",
          key: "orderCode"
        },
        {
          title: "工单号",
          key: "workCode"
        },
        {
          title: "计划生产日期",
          key: "time",
          type: "daterange"
        },
        {
          title: "产品编号",
          key: "materialCode"
        },
        {
          title: "设备编号",
          key: "deviceCode"
        }
      ],
      columns: [
        {
          title: "车间",
          key: "installPositionName",
          minWidth: 100,
          align: "center",
          resizable: true,
          tooltip: true
        },
        {
          title: "订单号",
          key: "orderCode",
          minWidth: 100,
          align: "center",
          resizable: true,
          tooltip: true
        },
        {
          title: "工单号",
          key: "workCode",
          minWidth: 100,
          align: "center",
          resizable: true,
          tooltip: true
        },
        {
          title: "设备编号",
          key: "deviceCode",
          minWidth: 100,
          align: "center",
          resizable: true,
          tooltip: true
        },
        {
          title: "设备型号",
          key: "deviceSpec",
          minWidth: 130,
          align: "center",
          resizable: true,
          tooltip: true
        },
        {
          title: "工装编号",
          key: "moldCode",
          minWidth: 130,
          align: "center",
          resizable: true,
          tooltip: true
        },
        {
          title: "产品编号",
          key: "materialCode",
          minWidth: 100,
          align: "center",
          resizable: true,
          tooltip: true
        },
        {
          title: "产品名称",
          key: "materialName",
          minWidth: 100,
          align: "center",
          resizable: true,
          tooltip: true
        },
        {
          title: "产品型号",
          key: "materialModel",
          minWidth: 100,
          align: "center",
          resizable: true,
          tooltip: true
        },
        {
          title: "计划生产数量",
          key: "planProduceQuantity",
          minWidth: 160,
          align: "center",
          resizable: true,
          tooltip: true
        },
        {
          title: "生产数量",
          key: "produceQuantity",
          minWidth: 130,
          align: "center",
          resizable: true,
          tooltip: true
        },
        {
          title: "提报数量",
          key: "reportedQuantity",
          minWidth: 130,
          align: "center",
          resizable: true,
          tooltip: true
        },
        {
          title: "工单状态",
          key: "state",
          minWidth: 130,
          align: "center",
          resizable: true,
          tooltip: true
        },
        {
          title: "操作",
          slot: "action",
          fixed: "right",
          minWidth: 180,
          align: "center"
        }
      ],
      loading: false,
      searchParams: {},

      pageNum: 1,
      pageSize: 10,
      total: 0,

      dataArr: [],
      pageSizeOption: [10, 20, 30, 40]
    };
  },
  mounted() {
    this.getTableColumnsWidth(this.columns);
    this.searchList();
  },
  methods: {
    reset() {
      this.searchParams = {};
      this.changeNum();
    },
    getSearch(params) {
      this.searchParams = JSON.parse(JSON.stringify(params[0]));
      const { workShop, time } = this.searchParams;
      if (time && time.length > 0) {
        this.searchParams.workStartDateV = this.searchParams.time[0];
        this.searchParams.workEndDateV = this.searchParams.time[1];
      }
      delete this.searchParams.time;
      if (workShop && workShop.length > 0) {
        this.searchParams.workShop = this.searchParams.workShop.at(-1);
      }else delete this.searchParams.workShop;
      this.pageNum=1;
      this.searchList();
    },
    //分页
    changeNum() {
      this.pageNum = 1;
      this.searchList();
    },
    changePageSize(pageSize) {
      this.pageSize = pageSize;
      this.searchList();
    },
    changePageNum(val) {
      this.pageNum = val;
      this.searchList();
    },
    //查询列表
    searchList() {
      let params = {
        pageNum: this.pageNum,
        pageSize: this.pageSize
      };
      for (let key in this.searchParams) {
        if (this.searchParams[key]) {
          this.$set(params, key, this.searchParams[key]);
        }
      }
      this.axios({
        url: "/dms/productionWork/queryProdWorkList",
        method: "post",
        data: params
      }).then(res => {
        if (res.code === 200) {
          this.dataArr = res.data.records;
          this.total = res.data.total;
        } else {
          this.$Message.warning({
            content: res.msg,
            duration: 6,
            closable: true
          });
        }
      });
    },
    linkUser(row) {
      this.$router.push({
        path: "/planManage/operationRecords/detail",
        query: {
          workCode: row.workCode
        }
      });
    }
  }
};
</script>
      
<style scoped lang="scss">
.ivu-input-number {
  width: -webkit-fill-available;
}

.btn-box {
  padding: 8px 5px !important;
}
</style>